<%@page import="org.springframework.web.context.request.SessionScope"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>    
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
   
    <link rel="stylesheet" href="/forestage/css/bootstrap.min.css">
    <link rel="stylesheet" href="/forestage/css/index.css">
    <link href="/shopcarduoxuan/css/index.css" rel="stylesheet" type="text/css" />
    <script src="/forestage/js/jquery.min.js"></script>	
    <script type="text/javascript" src="/shopcarduoxuan/js/Calculation.js"></script>



</head>
<body>
<header id="header">
    <nav id="top-nav">
        <div class="city">
            太原&nbsp;&nbsp;<small>更换</small>
        </div>
        <div class="login">
            <ul>
               <li><a href="/index">首页</a></li>
                <% if(session.getAttribute("user")==null){ %>
                   <li><a href="/login.jsp">登录</a></li>
                <%}else{ %>
                   <li><a>欢迎&nbsp;&nbsp;<span style="color:red">${user.username}</span>&nbsp;,&nbsp;</a>
                   <a href="/logout">注销</a></li>
                <%} %>
                <li><a href="/regist.jsp">注册</a></li>
                <li><a href="#">我的订单</a></li>
                <li><a href="#">帮助中心</a></li>
            </ul>
        </div>
    </nav>
    <div class="logo">
        <div class="content">
            <div class="left">
                <img src="/forestage/img/logo.png" alt="logo" width="240px" height="90px"/>
            </div>
            <div class="right">
                <img src="/forestage/img/ad.png" alt="广告" width="555px" height="89px"/>
            </div>
        </div>
    </div>
    <nav id="nav">
        <ul class="menu">
            
        </ul>
    </nav>
</header>

<!--中间部分-->
<section id="main">
<div class="gwc" style=" margin:auto;">
	<table cellpadding="0" cellspacing="0" class="gwc_tb1">
		<tr>
			<td class="tb1_td1"><input id="Checkbox1" type="checkbox"  class="allselect"/></td>
			<td class="tb1_td1">全选</td>
			<td class="tb1_td2">电影图片</td>
			<td class="tb1_td3">电影名</td>
			<td class="tb1_td5">购买数量</td>
			<td class="tb1_td1">单价</td>
			<td class="tb1_td6">小计</td>
			<td class="tb1_td7">操作</td>
		</tr>
	</table>
		   
	<!---商品加减算总数---->
	<script type="text/javascript">
		
	</script>
   <c:forEach items="${film}" var="film">	
	<table cellpadding="0" cellspacing="0" class="gwc_tb2">
		<tr>
			<td class="tb2_td1"><input type="checkbox" value="1" name="newslist" id="newslist-1" /></td>
			<td class="tb2_td2"><a href="#"><img src="/assets/img/${film.filmcover}"/></a></td>
			<td class="tb2_td3"><a href="#">${film.filmname}</a></td>
			<td class="tb1_td5" name="tb1_td5">
				<input class="min1" name="min1"  style=" width:20px; height:18px;border:1px solid #ccc;" type="button" value="-" />
				<input class="text_box1" name="text_box1" type="text" value="${film.ordernum}" style=" width:30px; text-align:center; border:1px solid #ccc;" />
				<input class="add1" name="add1" style=" width:20px; height:18px;border:1px solid #ccc;" type="button" value="+" />
			</td>
			<td class="tb1_td1"><input type="text" name="price" class="price" value="${film.price}"
			style="width:30px; text-align:center; border:1px solid #ccc;""/></td>
			<td class="tb1_td6"><label id="total1" class="tot" style="color:#ff5500;font-size:14px; font-weight:bold;"></label></td>
			<td class="tb1_td7"><a href="/shopcar/delete?orderid=${film.orderid}&userid=${sessionScope.user.userid}">移除购物车</a></td>
		</tr>
	</table>
  </c:forEach>		
	
	<!---总数---->
	<script type="text/javascript">
	$(function () {
		$(".quanxun").click(function () {
			setTotal2();
			//alert($(lens[0]).text());
		});
		function setTotal2() {
			var len = $(".tot");
			var num = 0;
			for (var i = 0; i < len.length; i++) {
				num = parseInt(num) + parseInt($(len[i]).text());

			}
			//alert(len.length);
			$("#zong1").text(parseInt(num).toFixed(2));
			$("#shuliang").text(len.length);
		}
	})
	</script>
	<table cellpadding="0" cellspacing="0" class="gwc_tb3">
		<tr>
			<td class="tb1_td1"><input id="checkAll" class="allselect" type="checkbox" /></td>
			<td class="tb1_td1" >全选</td>
			<td class="tb3_td1">
				<input id="invert" type="checkbox" />反选
				<input id="cancel" type="checkbox" />全不选
			</td>
			<td class="tb3_td2">已选商品 <label id="shuliang" style="color:#ff5500;font-size:14px; font-weight:bold;">0</label> 件</td>
			<td class="tb3_td3">合计(不含运费):<span>￥</span><span style=" color:#ff5500;"><label id="zong1" style="color:#ff5500;font-size:14px; font-weight:bold;"></label></span></td>
			<td class="tb3_td4"><span id="jz1">结算</span><a href="#" style=" display:none;"  class="jz2" id="jz2">结算</a></td>
		</tr>
	</table>

</div>
<script type="text/javascript">
	$(".add1").click(function () {
		var prev = $(this).prev();
		var num = parseInt(prev.val())+1;
		prev.val(num);
		setTotal(num, $(this)); GetCount();
	})
	$(".min1").click(function () {
		var next = $(this).next();
		var num = parseInt(next.val())-1;
		next.val(num);
		setTotal(num,$(this)); GetCount();
	})
	function setTotal(num, obj) {
		var price = obj.parents('.gwc_tb2').find('.price').val();
	    var tot = obj.parents('.gwc_tb2').find('.tot');
	    tot.html(price*num);
	} 
	$('.text_box1').each(function(){
		var num = $(this).val();
		setTotal(num, $(this));
	}) 
	//jquery特效制作复选框全选反选取消(无插件)
	// 全选        
	$(".allselect").click(function () {
		$(".gwc_tb2 input[name=newslist]").each(function () {
			$(this).prop("checked", true);
		});
		$("#invert").prop("checked",false);
		$("#cancel").prop("checked",false);
		GetCount();
	});

	//反选
	$("#invert").click(function () {
		$(".gwc_tb2 input[name=newslist]").each(function () {
			if ($(this).prop("checked")) {
				$(this).prop("checked", false);
			} else {
				$(this).prop("checked", true);
			} 
		});
		$(".allselect").prop("checked",false);
		$("#cancel").prop("checked",false);
		GetCount();
	});

	//全不选
	$("#cancel").click(function () {
		$(".gwc_tb2 input[name=newslist]").each(function () {
			$(this).prop("checked", false);
		});
		$(".allselect").prop("checked",false);
		$("#invert").prop("checked",false);
		GetCount();
	});

	// 所有复选(:checkbox)框点击事件
	$(".gwc_tb2 input[name=newslist]").click(function () {
		if ($(this).prop("checked")) {
		} else {
		}
	});

	// 输出
	$(".gwc_tb2 input[name=newslist]").click(function () {
		GetCount();
	});
//******************
function GetCount() {
	var conts = 0;
	var aa = 0;
	$(".gwc_tb2 input[name=newslist]").each(function () {
		if ($(this).prop("checked")) {
			var price = $(this).parents('.gwc_tb2').find('.tot').html();
			for (var i = 0; i < $(this).length; i++) {
				conts += parseInt(price);
				aa += 1;
			}
		}
	});
	$("#shuliang").text(aa);
	$("#zong1").html(conts);
	$("#jz1").css("display", "none");
	$("#jz2").css("display", "block");
}
</script>

</section>

<!--脚-->
<footer id="footer">
    <div class="other">
        <div class="other-content">
            <div class="other-left">
                <a href="#">联系我们</a>
                <a href="#">电影情报</a>
                <a href="#">友情链接</a> 
            </div>
            <div class="other-right">
                <a href="#">万达集团</a>
                <a href="#">万达院线官网</a>
            </div>
        </div>
    </div>
    <div class="info">
        <p>Copyright © 2011-2013 Wandafilm.com ALL rights reserved&nbsp;&nbsp;&nbsp;&nbsp;冀ICP备13013593&nbsp;&nbsp;&nbsp;&nbsp;增值电信业务经营许可证B2-20130186 </p>
    </div>
</footer>
</body>
</html>